<template>
    <basic-layout header-width="1200px" footer-position="fixed" :is-show-menu="false">
        <!-- Banner -->
        <div class="banner">
            <div class="register-wrapper">
                <!-- 注册方式 -->
                <a-tabs default-active-key="personal" class="register-tabs">
                    <a-tab-pane key="personal" tab="个人开发者">
                        <personal-form :submit-data-fn="handleSubmit" />
                    </a-tab-pane>
                    <a-tab-pane key="company" tab="企业开发者">
                        <company-form :submit-data-fn="handleSubmit" />
                    </a-tab-pane>
                </a-tabs>
            </div>
        </div>
    </basic-layout>
</template>

<script>
    import BasicLayout from '../../components/layouts/BasicLayout';
    import PersonalForm from './modules/PersonalForm';
    import CompanyForm from './modules/CompanyForm';
    import { saveDeveloper } from '../../apis/index';
    export default {
        components : { BasicLayout,PersonalForm,CompanyForm },
        props : {
            callback : { type : String, required : true }
        },
        mounted(){
            //  判断当前账户是否为新用户
            if (!this.$store.getters.isNewUser){
                this.$router.push({ path : this.callback }).then();
            }
        },
        methods : {
            handleSubmit : function(params) {
                let $this = this;
                //  保存开发者信息
                saveDeveloper(params).then(res => {
                    $this.$store.commit('setUserInfo',res.data);
                    $this.$router.push({ path : $this.callback }).then();
                });
            }
        }
    }
</script>
<style scoped>
    .banner{
        height: 538px;
        min-width: 1000px;
        background: rgb(32,77,278) center center no-repeat url(//cjlgb-design-developer.cdn.bcebos.com/icon/focus-img3.jpg);
    }
    .register-wrapper{
        width: 1200px;
        margin: 0 auto;
        position: relative;
    }
    .register-tabs{
        width: 450px;
        position: absolute;
        top: 35px;
        left: 50px;
        background: white;
        padding: 15px 25px 35px;
    }
</style>
